<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%
    String path = request.getContextPath();
    String basePath = request.getScheme() + "://"
            + request.getServerName() + ":" + request.getServerPort()
            + path + "/";
%>
<html>
<head>
    <base href="<%=basePath%>">
    <meta charset="utf-8"/>
</head>
<body>

<div class="main">
    <form class="layui-form search-form">
        <div class="layui-form-item">
            <div class="layui-input-inline">
                <select lay-verify="required" class="search-type">
                    <option value="">全部</option>
                    <option value="${%^primaryKey^%}">${%^primaryKey^%}</option>
                </select>
            </div>
            <div class="layui-input-inline">
                <input type="text" autocomplete="off" placeholder="搜索" class="layui-input search-value">
            </div>
            <div class="layui-input-inline">
                <button type="button" class="layui-btn search-button">
                    <svg t="1649678577823" class="icon" viewBox="0 0 1024 1024" version="1.1"
                         xmlns="http://www.w3.org/2000/svg" p-id="6314" width="32" height="32">
                        <path d="M955.069071 864.311021 740.015134 649.258107c-3.752464-3.751441-8.841366-5.860475-14.149255-5.860475-5.306866 0-10.395768 2.108011-14.149255 5.860475l-16.692171 16.692171-38.34226-38.34226c53.03796-59.810201 85.298711-138.442072 85.298711-224.478588 0-186.774871-151.952784-338.727655-338.727655-338.727655S64.527642 216.35456 64.527642 403.12943c0 186.775894 151.952784 338.728678 338.727655 338.728678 86.36909 0 165.276231-32.510438 225.170343-85.913718l38.303374 38.303374-17.34504 17.34504c-7.812943 7.813966-7.812943 20.48352 0 28.297486l215.051891 215.052914c3.753487 3.751441 8.841366 5.860475 14.149255 5.860475 5.306866 0 10.395768-2.108011 14.149255-5.860475l62.334697-62.334697C962.883037 884.794541 962.883037 872.124987 955.069071 864.311021zM104.546078 403.12943c0-164.709319 133.9999-298.709219 298.709219-298.709219s298.709219 133.9999 298.709219 298.709219S567.964616 701.839673 403.255297 701.839673 104.546078 567.838749 104.546078 403.12943zM878.585119 912.496463 691.829691 725.741036l34.036187-34.036187 186.755428 186.755428L878.585119 912.496463z"
                              p-id="6315" fill="#ffffff"></path>
                    </svg>
                </button>
            </div>
        </div>
    </form>
    <table class="layui-hide" id="list" lay-filter="list"></table>
</div>

<div class="set-data" style="display: none">
    <form class="layui-form set-data-form" lay-filter="set-data-form">
        <input type="text" name="${%^primaryKey^%}"
               style="display: none"
               lay-verify="required"
               class="layui-input">
        <div class="layui-row" style="padding: 20px;">
            ${%^fields^%}
        </div>
        <div class="layui-col-xs5">
            <div class="layui-form-item">
                <div class="layui-input-block">
                    <button class="layui-btn my-submit" lay-submit lay-filter="formDemo">
                        保存修改
                    </button>
                </div>
            </div>
        </div>
    </form>
</div>

<script type="text/html" id="toolbar">
    <div class="layui-btn-container">
        <button class="layui-btn layui-btn-sm" lay-event="deletes">批量删除</button>
        <button class="layui-btn layui-btn-sm" lay-event="add">添加</button>
    </div>
</script>

<script type="text/html" id="barDemo">
    <a class="layui-btn layui-btn-xs" lay-event="edit">编辑</a>
    <a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del">删除</a>
</script>


<jsp:include page="/WEB-INF/global/import.jsp"/>
<link rel="stylesheet" type="text/css" href="css/public-list.css"/>

<script type="text/javascript">

    (function () {
        let tips = "${tips}"
        if (!tips) {
            tips = getUrlParam("tips")
        }
        if (tips) {
            layer.msg(tips)
        }
    })()

    layui.use(['table', 'form', 'laydate'], function () {
        var table = layui.table;
        var form = layui.form;

         let currentTable = table.render({
            elem: '#list'
            , url: '/${%^tableName^%}/list'
            , cellMinWidth: 80
            , toolbar: '#toolbar'
            , defaultToolbar: ['filter']
            , cols: [
                [
                    {type: 'checkbox'}
                    ${%^tableFields^%}
                    , {title: '操作', align: 'center', toolbar: '#barDemo'}
                ]
            ]
            , page: true
            , limit: 10
            , limits: [3, 5, 10, 15]
            , request: {}
        });

        $(".search-button").click(() => {
            let type = $(".search-type").val().trim()
            let val = $(".search-value").val().trim()
            let data = {}
            if (val) if (type) data[type] = val
            currentTable.reload({
                page: table.page,
                limit: table.limit,
                where: data
            })
        })

        form.on('submit(formDemo)', function (data) {
            layer.confirm('确认修改信息', {
                btn: ['确认', '取消'] //按钮
            }, function () {
                set(data.field)
            }, function () {
            });
            return false;
        });

        table.on('toolbar(list)', function (obj) {

            var checkStatus = table.checkStatus(obj.config.id);
            switch (obj.event) {
                case "add":
                    window.location.href = "/page/${%^tableName^%}/add"
                    break;
                case 'deletes':
                    let arr = checkStatus.data
                    if (!arr || arr.length < 1) {
                        layer.msg("请选择条目")
                        return
                    }
                    layer.confirm('确认删除选择信息', function (index) {
                        let ids = []
                        arr.forEach(i => {
                            ids.push(i.id)
                        })
                        if (ids && ids.length > 0) deletes(ids)
                    })
                    break;
            }
        });

        table.on('tool(list)', function (obj) {
            var data = obj.data;
            if (obj.event === 'del') {
                layer.confirm('确认删除该信息', function (index) {
                    let arr = [data.id]
                    deletes(arr)
                    obj.del();
                    layer.close(index);
                });
            } else if (obj.event === 'edit') {
                setContent(data);
                layer.open({
                    type: 1,
                    title: '修改信息',
                    content: $(".set-data"),
                    area: ["80%", "80%"]
                });
                form.render()
            }
        });

        function setContent(data) {
            let emptyObject = {...data}
            for (const key in emptyObject) {
                emptyObject[key] = ""
            }
            form.val("set-data-form", emptyObject)
            form.val("set-data-form", data)
        }

        function set(data) {
            $.ajax({
                url: "/${%^tableName^%}/update",
                type: "post",
                contentType: "application/json",
                data: JSON.stringify(data),
                success(res) {
                    layer.msg(res.msg)
                    if ( res.code == 200 ){
                        currentTable.reload()
                    }
                },
                error(err) {
                    layer.msg(JSON.stringify(err))
                }
            })
        }

        function deletes(arr) {
            $.ajax({
                url: '/${%^tableName^%}/deletes',
                method: "post",
                contentType:"application/json",
                data: JSON.stringify(arr),
                success: function (res) {
                    layer.msg(res.msg)
                    if ( res.code == 200 ){
                        currentTable.reload()
                    }
                },
                error: function (err) {
                    layer.alert(JSON.stringify(err), {
                        title: "错误"
                    })
                }
            })
        }
    });

</script>

</body>
</html>

